<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
    <link href="./static/images/favicon.ico" mce_href="./static/images/favicon.ico" rel="icon" type="image/x-icon">
    <title></title>
    <style>
        html {
            height: 100%;
        }

        body {
            background: #000;
            color: #eee;
            font-family: sans-serif;
            font-size: 9pt;
            padding: 0;
            margin: 0;
            width: 100%;
            height: 100%;
            overflow: hidden;
        }

        @-webkit-keyframes scale {
            0% {
                -webkit-transform: scale(1);
                transform: scale(1);
                opacity: 1;
            }

            45% {
                -webkit-transform: scale(0.1);
                transform: scale(0.1);
                opacity: 0.7;
            }

            80% {
                -webkit-transform: scale(1);
                transform: scale(1);
                opacity: 1;
            }
        }

        @keyframes scale {
            0% {
                -webkit-transform: scale(1);
                transform: scale(1);
                opacity: 1;
            }

            45% {
                -webkit-transform: scale(0.1);
                transform: scale(0.1);
                opacity: 0.7;
            }

            80% {
                -webkit-transform: scale(1);
                transform: scale(1);
                opacity: 1;
            }
        }

        .ball-pulse>div:nth-child(1) {
            -webkit-animation: scale 0.75s -0.24s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
            animation: scale 0.75s -0.24s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
        }

        .ball-pulse>div:nth-child(2) {
            -webkit-animation: scale 0.75s -0.12s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
            animation: scale 0.75s -0.12s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
        }

        .ball-pulse>div:nth-child(3) {
            -webkit-animation: scale 0.75s 0s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
            animation: scale 0.75s 0s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
        }

        .ball-pulse>div {
            background-color: #fff;
            width: 12px;
            height: 12px;
            border-radius: 100%;
            margin: 4px;
            -webkit-animation-fill-mode: both;
            animation-fill-mode: both;
            display: inline-block;
        }

        /* .loader {
              box-sizing: border-box;
              width: 200px;
              height: 100px;
            } */

        .loader {
            position: absolute;
            top: 50%;
            left: 50%;
            text-align: center;
            transform: translate(-50%, -50%);
        }

    </style>
</head>

<body style="background: #222">
    <div id="app" style="width: 100%; height: 100%">
        <xbsj-app></xbsj-app>
    </div>

    <div class="loader" id="loading">
        <div class="loader-inner ball-pulse">
            <div></div>
            <div></div>
            <div></div>
        </div>
        <span style="color: white">正在加载 ...</span>
    </div>

    <script data-main="./static/startup" src="./static/thirdParty/requirejs-2.1.20/require.min.js"></script>
</body>

</html>